* {
  margin: 0;
  padding: 0;
}

section {
  width: 300px;
  height: 300px;

  background-color: aqua;

  display: grid;
  /* grid-template-columns: minmax(50px,60px) 1fr repeat(4,1fr); */
  grid-template-columns: repeat(5, [c-start] 1fr [c-end]);
  grid-template-rows: 1fr repeat(4, 1fr);

  grid-template-areas: ". . a1 . . " ". . a1 . .";
}

section div {
  background-color: khaki;
  background-clip: content-box;

  padding: 5px;
}

section div:nth-child(1) {
  background-color: palevioletred;

  grid-row-start: 3;
  grid-row-end: 4;
  grid-column-start: 3;
  grid-column-end: 5;
}

section div:nth-child(2) {
    background-color: lightcoral;
  
    grid-row-start: 4;
    grid-row-end: 5;
    grid-column-start: c-start 1;
    grid-column-end: c-end 1;
  }

  section div:nth-child(3) {
    background-color: lightgray;
  
    grid-row:4/5;
    grid-column: c-start 4/c-end 4;
  }
  section div:nth-child(4) {
    background-color: lightgray;
  
    grid-area: 5/4/6/6;
  }
  section div:nth-child(5) {
    background-color: lightgray;
  
    grid-area: a1;
  }
